﻿@tailwind base;
@tailwind components;
@tailwind utilities;
/* 字体声明（使用 CDN 字体） */
@import url('https://fonts.googleapis.com/css2?family=Inter:wght@100;200;300;400;500;600;700;800;900&display=swap');
@import url('https://fonts.googleapis.com/css2?family=JetBrains+Mono:wght@100;200;300;400;500;600;700;800&display=swap');

body {
    font-family: 'Inter', sans-serif;
}

@layer utilities {
    .content-auto {
        content-visibility: auto;
    }

    .editor-shadow {
        box-shadow: 0 4px 20px rgba(0, 0, 0, 0.1);
    }

    .glass-effect {
        backdrop-filter: blur(8px);
        background-color: rgba(255, 255, 255, 0.7);
    }

    .gradient-border {
        position: relative;
        border-radius: 0.75rem;
    }

    .gradient-border::before {
        content: "";
        position: absolute;
        inset: -2px;
        z-index: -1;
        border-radius: 0.85rem;
        background: linear-gradient(135deg, #3b82f6, #0ea5e9);
        opacity: 0;
        transition: opacity 0.3s ease;
    }

    .gradient-border:hover::before {
        opacity: 1;
    }

    .title-gradient-border {
        position: relative;
        border-radius: 0.75rem;
    }

    .title-gradient-border::before {
        content: "";
        position: absolute;
        inset: -2px;
        z-index: -1;
        border-radius: 0.85rem;
        background: linear-gradient(135deg, #3b82f6, #0ea5e9);
        opacity: 1; /* 始终显示边框 */
    }
}

/* 自定义 Tailwind 主题扩展 */
:root {
    --primary: #3b82f6;
    --secondary: #64748b;
    --accent: #0ea5e9;
    --dark: #1e293b;
    --light: #f8fafc;
    --surface: #ffffff;
    --primary-light: #e0edff;
    --accent-light: #e0f2fe;
    --success: #22c55e;
    --error: #ef4444;
    --warning: #f59e0b;
}